<template>
  <div class="son">
    <!-- <h2>这里是父组件的数据： {{ fData }} </h2> -->
    <!-- <h2>我是父组件传递修改后的数据：{{myData}} </h2> -->
    <div>
      {{ sendToSon }}
    </div>
    <button @click="sendToFather">获取父组件修改的值</button>
  </div>
</template>

<script>

export default {
  name: 'Son',
  props: {
    sendToSon: String,
    data: {
      type: String,
      default: ''
    },
    message: String
  },
  mounted() {
    this.$emit('getMessage', this.toMessage)
  },
  data () {
    return {
      myData: this.fatherData,
      toMessage: '子组件定义的数据'
    }
  },
  methods: {
    changeData () {
      this.myData += ' + 改变数据'
    },
    sendToFather() {
      this.$emit('msgFromSon', this.toMessage);
    }
  }
}
</script>

<style>
.son {
  width: 400px;
  height: auto;
  padding: 10px;
  margin: 0 auto;
  border: 1px solid red
}
</style>